<?php
declare(strict_types=1);

namespace LowCode\Naive;

use LowCode\Node;
use LowCode\Support\JsExp;

/**
 * 按钮组件 NFloatButton
 * @method static static make(mixed $children = null) NFloatButton 按钮组件
 */
class FloatButton extends FloatButtonGroup
{
    /**
     * @param mixed $children
     */
    public function __construct(mixed $children = null)
    {
        parent::__construct();
        $this->children($children);
    }

    /**
     * 按钮的 CSS width 属性
     * @param int|string|JsExp $value
     * @return $this
     */
    public function width(int|string|JsExp $value): static
    {
        return $this->prop('width', $value);
    }

    /**
     * 按钮的 CSS height 属性
     * @param int|string|JsExp $value
     * @return $this
     */
    public function height(int|string|JsExp $value = 40): static
    {
        return $this->prop('height', $value);
    }


    /**
     * 按钮的类型
     * @param string|JsExp $type 'default' | 'primary'
     * @return $this
     */
    public function type(string|JsExp $type = 'default' | 'primary'): static
    {
        return $this->prop('type', $type);
    }


    /**
     * 按钮的primary类型
     * @return $this
     */
    public function primary(): static
    {
        return $this->type('primary');
    }


    /**
     * 触发菜单显示的方式
     * @param string|JsExp $value
     * @return $this
     */
    public function menuTrigger(string|JsExp $value = 'click' | 'hover'): static
    {
        return $this->prop('menu-trigger', $value);
    }

    /**
     * 是否打开菜单
     * @param bool|JsExp $bool
     * @return $this
     */
    public function showMenu(bool|JsExp $bool = true): static
    {
        return $this->prop('show-menu', $bool);
    }


    /**
     * 菜单打开或者关闭的回调 on-update:show-menu
     * @param string $event 函数 (value: boolean) => void
     * @param string|null $id
     * @param array $modifiers
     * @return $this
     */
    public function onUpdateValue(string $event = "()=>{ }", string $id = null, array $modifiers = []): static
    {
        return $this->event("update:show-menu",jsFn($event, $id), $modifiers);
    }

    /**
     * 按钮中的描述信息 设置 slot description 内容
     * @param Node $node
     * @return $this
     */
    public function slotDescription(Node $node): static
    {
        return $this->addSlot($node,"description");
    }

    /**
     * 按钮会触发的子菜单 设置 slot menu 内容
     * @param Node $node
     * @return $this
     */
    public function slotMenu(Node $node): static
    {
        return $this->addSlot($node,"menu");
    }
}
